<template>
  <div class="page">
    <u-navbar title="物流公司">

    </u-navbar>

    <div class="global-list" v-if="logisticsList.length != 0">
      <div class="global-item" @click="handleClick(item)" v-for="(item,index) in logisticsList" :key="index">

        <div class="flex goods-item">
          <div class="goods-name">{{item.name}}</div>
          <div class="flex goods-right-col">
            <div class="goods-price" :style="{color:!item.selected  ? '#ff6262' : ''}">{{item.selected ? '关闭' : '开启'}}</div>
          </div>
        </div>
        
      </div>
    </div>

    <u-modal v-model="lock" @confirm="updateLogistics" confirm-color="#333" show-cancel-button :content="showContent" :title="showTitle">
    </u-modal>
  </div>
</template>

<script>
import {
  getLogistics,
  logisticsUnChecked,
  logisticsChecked,
} from "@/api/shops";

export default {
  data() {
    return {
      logisticsList: [], //评论列表
      current: 0,
      showTitle: "",
      showContent: "",
      lock: false,
      logisticsData: {}, //存储当前点击的物流信息
    };
  },
  methods: {
    onShow() {
      this.logisticsList = [];
      this.init();
    },

    // 开关物流公司
    async updateLogistics() {
      // 判断如果当前没开启则开启
      if (this.logisticsData.selected === null) {
        let res = await logisticsChecked(this.logisticsData.id);
        if (res.data.success) {
          this.load();
        }
      } else {
        let res = await logisticsUnChecked(this.logisticsData.selected);
        if (res.data.success) {
          this.load();
        }
      }
    },

    handleClick(val) {
      this.logisticsData = val;
      if (val.selected) {
        this.showTitle = "关闭";
        this.showContent = "您确认关闭此物流公司";
        this.lock = true;
      } else {
        this.showTitle = "开启";
        this.showContent = "您确认开启此物流公司";
        this.lock = true;
      }
    },

    load() {
      this.logisticsList = [];
      this.init();
    },

    async init() {
      uni.showLoading({
        title: "加载中",
      });
      let res = await getLogistics(this.searchForm);
      if (res.data.success) {
        this.logisticsList.push(...res.data.result);
      }
      uni.hideLoading();
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/components/global.scss";
.goods-name {
  margin-left: 0 !important;
}
.global-item{
  border-radius: 0 !important;
}
</style>